<template>
  <div>
<form class="mui-input-group">
      <div class="mui-input-row">
        <label>账号</label>
        <input type="text" class="mui-input-clear" placeholder="请输入用户名" v-model="register.username">
      </div>
      <div class="mui-input-row">
        <label>密码</label>
        <input type="password" class="mui-input-password" placeholder="请输入密码" v-model="register.password">
      </div>
      <div class="mui-input-row">
        <label>确认密码</label>
        <input type="password" class="mui-input-password" placeholder="请确定密码" v-model="register.checkpassword">
      </div>
      <div class="mui-input-row">
        <label>邮箱</label>
        <input type="text" class="mui-input-password" placeholder="请输入邮箱" v-model="register.email">
      </div>
      <div class="mui-button-row">
        <!-- <button type="button" class="mui-btn mui-btn-primary" @click="login_event()" style="margin-right:30px;">确认</button> -->
        <button type="button" class="mui-btn mui-btn-danger" @click="res()">注册</button>
      </div>
    </form>
  </div>
</template>

<script>
export default {
  data () {
    return {
      register: {
        username: '',
        password: '',
        checkpassword: '',
        email: ''
      }
    }
  },
  methods: {
    res () {
      // 要全部信息都填
      if (this.register.username === '' || this.register.password === '' ||
       this.register.checkpassword === '' || this.register.email === '') {
        this.$toast('请输入信息')
      } else {
        // 全填后,验证密码
        if (this.register.password === this.register.checkpassword) {
          // 多一个无所谓,因为没有东西去接受他
          this.$http.post('register', this.register).then((res) => {
            if (res.data.code === 0) {
              this.$toast(res.data.msg)
            } else {
              // 注册完成后的操作
              // 存入vuex之中
              this.$store.commit('user/setUser', res.data.data)
              this.$auth.setAuthorization(res.data.data.session_id)
              this.$router.push('/my')
            }
          }).catch(() => {
            this.$toast('注册失败')
          })
        } else {
          this.$toast('两次密码不一样')
        }
      }
    }
  }
}
</script>
<style lang="scss" scoped>

</style>
